<include file="Public:_header_user" />
<link href="__ROOT__/font/font-awesome-4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css"/>
<style>
    .goodswrap{width:100%;}
	.goodswrap .goodsm{float:left;margin-left:10px;}
	#action span{cursor:pointer;}
</style>
<div align="center">
    <div class="cartcontent">
        <include file="Public:uc_left" />
		<div class="fl">
			<div class="uc_rline2">
			    <div>
			        <div class="btn btn-default btn-sm" style="margin-left:20px;" data-toggle="modal" 
   data-target="#myModal" id="add">新增收货地址</div>
                    <volist name="address" id="adr" key="k">
			    	<table class="ucadtable">
			    		<tr class="header">
			    			<td colspan="2">{$adr['receiver']}&nbsp;{$adr['address']}</td>
			    		</tr>
			    		<tr>
			    			<td class="l">收货人：</td>
			    			<td><span class="receiver">{$adr['receiver']}</span></td>
			    		</tr>
			    		<tr>
			    			<td class="l">所在地区：</td>
			    			<td>{$adr['area']}</td>
			    		</tr>
			    		<tr>
			    			<td class="l">地址：</td>
			    			<td><span class="address">{$adr['address']}</span></td>
			    		</tr>
			    		<tr>
			    			<td class="l">手机：</td>
			    			<td><span class="mobile">{$adr['mobile']}</span></td>
			    		</tr>
			    		<tr>
			    			<td class="l">电子邮箱：</td>
			    			<td ><span class="email">{$adr['email']}</span></td>
			    		</tr>
			    		<tr>
			    			<td colspan="2" align="right" data-id="{$k}" id="action">
			    				  <span>设为默认</span> 
			    				  <span class="edit" data-toggle="modal" 
   data-target="#myModal">编辑</span>
			    				   <span>删除</span>
			    			</td>
			    		</tr>
			    	</table>
			    	</volist>
			    </div>
			</div>
		</div>
		<div class="clear"></div>
	 </div>
</div>	 


<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" 
   aria-labelledby="myModalLabel" aria-hidden="true">
   <form name='address'>
   <input name="id" type="hidden" />
   <div class="modal-dialog">
      <div class="modal-content" class="adralert">
         <div class="modal-header" style="padding:5px;">
            <button type="button" class="close" 
               data-dismiss="modal" aria-hidden="true">
                  &times;
            </button>
            <h4 class="modal-title" id="myModalLabel">
                 收货地址
            </h4>
         </div>
         <div style="text-align:left;padding-left:20px;">
               <span class="line_30">收货人</span><br/>
               <input type="text" name="receiver" class="form-control adrinput1"/> 
         </div>
         <div style="text-align:left;padding-left:20px;">
                <span class="line_30">所在地区</span><br/>
                <select class="xk_address" name="province">
	            </select>
	            <select class="xk_address" name="city">
	            </select>
	            <select class="xk_address" name="area">
	            </select>
         </div>
         <div style="text-align:left;padding-left:20px;">
               <span class="line_30">详细地址</span><br/>
               <input type="text" name="address_detail" class="form-control adrinput1"/> 
         </div>
         <div style="text-align:left;padding-left:20px;">
               <span class="line_30">手机号码</span><br/>
               <input type="text" name="mobile" class="form-control adrinput1"/> 
         </div>
         <div style="text-align:left;padding-left:20px;">
               <span class="line_30">邮箱</span><br/>
               <input type="text" name="email" class="form-control adrinput1"/> 
         </div>
         <div class="modal-footer">
            <button type="button" class="btn btn-default" 
               data-dismiss="modal">关闭
            </button>
            <button type="button" class="btn btn-primary" id="submit">
               保存收货地址
            </button>
         </div>
      </div><!-- /.modal-content -->
    </div>
    </form>
</div>
<script src="__PUBLIC__/js/ad.js"></script>
<script>
    $(document).ready(function(){
        $(".xk_address").change(function(){
        	var id=$(this).val();
            var tag=$(this).attr("name");
            change(id,tag);
        });
        var address_url="{:U('home/Public/get_address')}";
        address_province(address_url,0);
        //表单提交 
        $("#submit").click(function(){
         	  var data=$("form[name='address']").serialize();
         	  var url="{:U('doaddress')}";
         	  $.post(url,data,function(data){
                    data=eval("("+data+")");
                    if(data['status']=="success"){
                       window.location.reload();
                    }
         	  });
        });
        //编辑表单
        $(".edit").click(function(){
            var id=$(this).parent().data('id');
            var url="{:U('editaddress')}";
            $.post(url,{id:id},function(data){
                 console.log(data);
                 editform(data,id);
            })
            
        });

        $("#add").click(function(){
            $("form[name='address']").find('input').val('');
        });

    });
    function change(id,tag){
        var url="{:U('Public/get_address')}";
        if(tag=="province"){
          address_city(url,id);
        }else if(tag=="city"){
          address_area(url,id);
        }
    }
    function editform(data,id){
        data=eval("("+data+")");
        var p=data['data']['area'][0];
        var c=data['data']['area'][1];
        var a=data['data']['area'][2];
        $("input[name='receiver']").val(data['data']['receiver']);
        $("input[name='email']").val(data['data']['email']);
        $("input[name='mobile']").val(data['data']['mobile']);
        $("input[name='address_detail']").val(data['data']['address']);
        $("input[name='id']").val(id);
        var address_url="{:U('home/Public/get_address')}";
        address_province(address_url,0,p,c,a);
    }
</script>

</body>
</html>
